<template lang="html">
    <div class="que-bix">
        <div class="eleme">
            <el-form :inline="true" :model="formInline" class="demo-form-inline">
                <el-form-item label="输入学号">
                    <el-input v-model="formInline.user" placeholder="输入学号"></el-input>
                </el-form-item>
                <!-- <el-form-item label="选择类型">
                    <el-select v-model="formInline.type" placeholder="选择类型">
                        <el-option label="全部" value="11"></el-option>
                        <el-option label="网上报名" value="10"></el-option>
                        <el-option label="手动添加" value="01"></el-option>
                    </el-select>
                </el-form-item> -->
                <el-form-item label="时间范围">
                    <el-date-picker v-model="formInline.value7" type="daterange" align="right" unlink-panels range-separator="至"
                    start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions2">
                    </el-date-picker>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">查询</el-button>
                </el-form-item>
                <el-button type="success" v-if="countshow" plain @click="countshow = !countshow">共{{count}}次</el-button>
            </el-form>

            <el-table :data="labourData" style="width: 100%">
                <el-table-column prop="id" label="编号" width="90"></el-table-column>
                <el-table-column prop="studentid" label="学号" width="140"></el-table-column>
                <el-table-column prop="realname" label="姓名" width="120"></el-table-column>
                <el-table-column prop="onclass" label="班级" width="150"></el-table-column>
                <el-table-column prop="setcount" label="次数" width="90"></el-table-column>
                <el-table-column prop="date" label="日期" width="120"></el-table-column>
                <el-table-column prop="admin" label="管理员" width="140"></el-table-column>
                <el-table-column prop="content" label="内容"></el-table-column>
            </el-table>
        </div>
    </div>
</template>


<script>
import tool from '../../utils/tools';
export default {
    name: 'que',
    data(){
        return {
            formInline: {
                user: '',
                type: 11,
                value7: '',
                page:1
            },
            count:9,
            countshow:false,
            pickerOptions2: {
                shortcuts: [
                {
                    text: '最近一月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                },{
                    text: '最近半年',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 180);
                        picker.$emit('pick', [start, end]);
                    }
                },{
                    text: '最近一年',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 365);
                        picker.$emit('pick', [start, end]);
                    }
                },{
                    text: '上学年',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(1567267200000);
                        end.setTime(1598889600000);
                        picker.$emit('pick', [start, end]);
                    }
                },{
                    text: '本学年',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(1598889600000);
                        picker.$emit('pick', [start, end]);
                    }
                },{
                    text: '本学期',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(1598889600000);
                        picker.$emit('pick', [start, end]);
                    }
                }]
            },
            labourData: []
        }
    },
    methods:{
        onSubmit() {
            if(this.formInline.user==""||this.formInline.user.length!=14){
                this.$notify({
                    title: '必须输入学号',
                    offset: 100,
                    duration:2000,
                    message: '必须输入学号搜索',
                    type: 'warning'
                });
                return false;
            }
            var value = this.formInline;
            if(this.formInline.value7 && this.formInline.value7[0] && this.formInline.value7[1]){
                value.time = [ parseInt(this.formInline.value7[0].getTime() / 1000 ), parseInt(this.formInline.value7[1].getTime() / 1000 ) + 86400];
            }else{
                value.time = [0,0];
            }
			var domain = '//www.ayouleyang.cn';
            var pu = domain + "/index/home/e12c5425574cf65a1d9ab0a5d5a";
            const loading = this.$loading({
                text: '拼命加载中',
                spinner: 'el-icon-loading',
                background:"rgba(0, 0, 0, 0.2)"
            });
            // value.studentid = "20170108070257";
            value.studentid = value.user;
            this.$http.post(pu,this.formInline,{emulateJSON: true}).then(function(res){
                loading.close();
                this.$notify({
                    title: '义务劳动查询',
                    message: '共查到'+res.body.data.length+"条数据。",
                    type: 'success'
                });
                if(res.body.state==1){
                    var newTable = [];
                    var data = res.body.data;
                    var count = 0;
                    for (var i = 0; i < data.length; i++) {
                        count += data[i].setcount;
                        newTable.push({date:tool.stamp2datetime(data[i].time,1000,'date'),
                            id:i+1,
                            studentid:data[i].studentid,
                            realname:data[i].realname,
                            onclass:data[i].onclass,
                            setcount:data[i].setcount,
                            content:data[i].content,
                            setcount:data[i].setcount,
                            admin:data[i].admin
                        });
                    }
                    this.labourData = newTable;
                    this.count = count;
                    this.countshow = true;
                }
            },function(err){
                loading.close();
                this.$message.error('服务器错误！');
            });
        },autoLoad(){
        }
    },mounted(){
        this.autoLoad();
    }
}
</script>

<style scoped>
.que-bix{
	padding: 16px;
	font-size: 18px;
}
</style>
